﻿window.onscroll=function(){
  var currentItem="#item1";//当前到达楼层的指示器
  //楼层距离顶部的高度 ==卷起的高度，说明到达该楼层（卷起高度）
  var collectH = document.documentElement.scrollTop || document.body.scrollTop;
  //^两种情况防止节点不同
  
  var windowHeight = window.innerHeight;//窗口的高度

  //当前有current的指示器
  var hrefItem = document.querySelector('#menu .current');
  //当前有current的指示器的节点的href值
  var hrefvalue = hrefItem.getAttribute('href');
//每一层楼距离顶部的高度
  var items=document.querySelectorAll('.item');
  //1拿到所有的楼层遍历每一楼层高度
  items.forEach(i => {
    var offsetTop=i.offsetTop;
    console.log(offsetTop)
    //当页面卷起高度 等于 距离顶部高度 说明到达楼层 更改指示器颜色
    if(collectH > offsetTop-10){
      currentItem = "#"+i.getAttribute('id');

    }
  })
  //页面卷起的距离+窗口的高度==页面（body）整体高度==>说明滚动条到底了
  if(collectH+windowHeight > document.documentElement.offsetHeight-10){
    currentItem = "#item5";
  }

  if(currentItem != hrefvalue){
    hrefItem.classList.remove('current');
    document.querySelector("#menu a[href='"+currentItem+"']").classList.add('current');
  }
  
}